<template>
  <view class="inventory">
    <u-cell-group>
      <u-cell title="资产编号" :value="obj.assetsNo"></u-cell>
      <u-cell title="资产名称" :value="obj.assetsName"></u-cell>
      <u-cell title="资产型号" :value="obj.assetsModel"></u-cell>
      <u-cell title="使用人" :value="obj.user"></u-cell>
      <u-cell title="资产大类" :value="obj.assetsClass"></u-cell>
      <u-cell title="资产小类" :value="obj.assetsSubclass"></u-cell>

      <u-cell title="当前位置" :value="obj.deposit">
        <view slot="value">

          <view style="display:flex;align-items: center;">
            <text>{{model.address}}</text>
            <u-icon @click="getCurrentLocation" name="reload" color="#2979ff" size="28"></u-icon>

          </view>

        </view>
      </u-cell>
      <u-cell title="存放地" :value="obj.deposit">
        <view slot="value" style="width: 50%;">
          <view class="deposit">
            <u-input v-model="obj.deposit" border="none" placeholder="请输入" inputAlign="right">
            </u-input>
            <!-- <view class="deposit-btn">
              <u-button text="查询" type="primary" style="width:30rpx" @click="inquire(obj.deposit)"></u-button>
            </view> -->
          </view>
        </view>
      </u-cell>

      <u-cell title="图片上传" :value="obj.deposit">
        <view slot="value" style="width:70%">
          <uploadFile @success="success" :maxCount="999" @deleteHanlder="delHanlder"></uploadFile>

        </view>
      </u-cell>

    </u-cell-group>
    <u-picker :show="selectShow" :columns="columns" @cancel="selectShow=false" @close="selectShow=false" @confirm="confirm" keyName="label" closeOnClickOverlay></u-picker>

    <view class="btn">
      <view class="save" @click="submit">保存</view>
    </view>
  </view>
</template>

<script>
import QQMapWX from '../../libs/qqmap-wx-jssdk.js'
var qqmapsdk
export default {
  data() {
    return {
      obj: {

      },
      selectShow: false,
      columns: [],
      model: {
        assetsID: "",
        assetsNo: "",
        assetsName: "",
        creatUser: "",
        creatUserName: "",
        img: [],
        location: "",
        address: "",
        remarks: "",
        objectID: "",
        isDelete: true,
        createTime: "",
        createUserID: "",
        updateTime: "",
        order: 0
      }
    }
  },
  onShow() {

  },
  onLoad(options) {
    var assetNo = options.assetNo
    this.GetDetilsByNo(assetNo)
    this.getCurrentLocation()
  },
  methods: {
    // 图片上传
    success(file) {
      this.model.img = file
    },
    delHanlder(index) {
      this.model.img = this.model.img.splice(index, 1)
    },
    // 通过自带的方法获取到当前的经纬度，调用方法获取到地址获取到地址的中文信息
    getCurrentLocation() {
      // 实例化API核心类
      qqmapsdk = new QQMapWX({
        key: 'M7NBZ-GGMK3-ZVT3G-YQIJE-EUNZQ-NDFYU'
      })
      var that = this
      uni.getLocation({
        type: 'wgs84',
        success: function (res) {

          //调用距离计算接口
          that.model.location = res.latitude + ',' + res.longitude
          qqmapsdk.reverseGeocoder({
            location: {
              latitude: res.latitude,
              longitude: res.longitude
            },
            success: function (res) {

              that.model.address = res.result.address
            }

          })
        }
      })

    },


    GetDetilsByNo(assetNo) {
      this.$u.api.GetDetilsByNo({ assetNo: assetNo }).then((res) => {
        this.obj = res.data
        console.log(this.obj, 'this.obj')
      })
    },
    // 获取存放地
    // inquire(deposit) {
    //   this.selectShow = true
    //   this.$u.api.GetDeposit({ deposit: deposit }).then(res => {
    //     const data = res.data.map((x) => {
    //       return {
    //         id: x,
    //         label: x
    //       }
    //     })
    //     this.columns = [data]
    //   })
    // },

    confirm(e) {
      this.selectShow = false
      this.obj.deposit = e.value[0].label
    },

    submit() {
      if (this.model.img.length === 0) return this.$u.toast('请上传附件')
      const data = {
        assetsID: this.obj.assetsID,
        assetsNo: this.obj.assetsNo,
        assetsName: this.obj.assetsName,
        creatUser: this.obj.creatUser,
        creatUserName: this.obj.creatUserName,
        img: JSON.stringify(this.model.img),
        location: this.model.location,
        address: this.model.address,
        remarks: this.obj.remarks,
        objectID: this.obj.objectID,
        isDelete: this.obj.isDelete,
        createTime: this.obj.createTime,
        createUserID: this.obj.createUserID,
        updateTime: this.obj.updateTime,
        order: this.obj.order
      }
      this.$u.api.PhoneManual(data).then(res => {
        this.$u.toast('手动盘点成功');
        uni.reLaunch({
          url: "/pages/home/index"
        });
      })
    },

  }
}
</script>

<style lang="scss" scoped>
.inventory {
  .deposit {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    .deposit-btn {
      width: 100rpx;
      margin-left: 10rpx;
    }
  }
  .btn {
    font-size: 30rpx;
    display: flex;
    justify-content: space-around;
    background: #f5f5f5;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    // padding: 30rpx 0;

    .save {
      width: 100%;
      height: 88rpx;
      background-color: #0d6fb8;
      border-radius: 10rpx;
      color: #ffffff;
      text-align: center;
      line-height: 88rpx;
    }
  }
}
</style>